<template>
  <VanNavBar
      style="
      width: 100vw;
      padding-left: 3vw;
      padding-right: 3vw;
      padding-top: 1vh;
      padding-bottom: 1vh;
      color: #000;
      background-color: white;
      font-size: large;
    "
      :left-arrow="showBack"
      @click-left="goBack"
  >
    <template #title>
      <span style="font-size: 1.2rem; font-weight: bold"> {{ props.title }} </span>
    </template>
    <template #right>
      <slot name="right"></slot>
    </template>
  </VanNavBar>
</template>

<script setup>
import {useRouter} from 'vue-router'
// 路由对象
const router = useRouter()

const props = defineProps({
  title: String,
  showBack: Boolean,
  backMethod: Function,
})

const goBack = () => {
  if (props.backMethod) {
    props.backMethod()
  } else {
    router.back()
  }
}
</script>
